import React, { useEffect } from "react";
import ShrinkLine from "@/components/charts/ShrinkLine";
import { connect } from "dva";
import PropTypes from "prop-types";
import "./index.less";

const SharesBox = ({ dispatch, halfYearDay, code }) => {
  const data = halfYearDay[code] || {};
  useEffect(() => {
    if (code) {
      dispatch({
        type: "shares/queryHalfYearDayKlines",
        payload: {
          secid: `1.${code}`,
          fields2: "f53",
        },
      });
    }
  }, []);
  return (
    <div className="share-box">
      <div className="option">
        <div className="cancel"></div>
      </div>
      <div className="chart">
        <ShrinkLine data={data.klines} />
      </div>
      <div className="name">{data.name}</div>
      <div className="code">{data.code}</div>
    </div>
  );
};

SharesBox.propTypes = {
  code: PropTypes.string.isRequired,
};

// export default Products;
export default connect(({ shares }) => ({
  halfYearDay: shares.halfYearDay,
}))(SharesBox);
